<template>
    <div class="app-container">
        <div style="width:100%;display: flex;">

            <el-card style="flex:1;">
                <div slot="header" class="clearfix">
                    <span>微信配置</span>
                </div>
                <el-form ref="wechatPay" :rules="wechatPayRules" :model="wechatPay" label-width="120px">
                    <el-form-item label="appid" prop="appid">
                        <el-input v-model="wechatPay.appid"></el-input>
                    </el-form-item>
					<el-form-item label="app秘钥" prop="secret">
					    <el-input type="textarea" v-model="wechatPay.secret"></el-input>
					</el-form-item>
					<el-form-item label="商户号" prop="mchid">
					    <el-input type="textarea" v-model="wechatPay.mchid"></el-input>
					</el-form-item>
                    <el-form-item label="支付秘钥" prop="key">
                        <el-input type="textarea" v-model="wechatPay.key"></el-input>
                    </el-form-item>
                    <el-form-item label="SSL证书路径" prop="SSLCERT_PATH">
                        <el-input type="textarea" v-model="wechatPay.SSLCERT_PATH"></el-input>
                    </el-form-item>
                    <el-form-item label="SSL KEY路径" prop="SSLKEY_PATH">
                        <el-input type="textarea" v-model="wechatPay.SSLKEY_PATH"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="submitForm('wechatPay',1)">保存</el-button>
                    </el-form-item>
                </el-form>
            </el-card>

            <el-card style="margin-left: 10px;flex:1;">
                <div slot="header" class="clearfix">
                    <span>支付宝配置</span>
                </div>
                <el-form ref="alyPay" :model="alyPay" :rules="alyPayRules" label-width="120px">
                    <el-form-item label="应用ID" prop="app_id">
                        <el-input v-model="alyPay.app_id"></el-input>
                    </el-form-item>
                    <el-form-item label="公钥" prop="public_key">
                        <el-input type="textarea" :rows="5" v-model="alyPay.public_key"></el-input>
                    </el-form-item>
                    <el-form-item label="私钥" prop="private_key">
                        <el-input type="textarea" :rows="6" v-model="alyPay.private_key"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="submitForm('alyPay',2)">保存</el-button>
                    </el-form-item>
                </el-form>
            </el-card>
        </div>

    </div>
</template>

<script>
    import { getConfigWechat,saveWechat,getConfigAlipay, saveAlipay} from '@/api/role'

    export default {
        name: "payConfig",
        data() {
            return {
                wechatPay: {
                    id: '',
                    appid: '',//appid
                    mchid: '',//商户号
					secret:'',//app秘钥
                    key: '',//支付秘钥
                    SSLCERT_PATH: '',//ssl证书路径
                    SSLKEY_PATH: '',//ssl key路径
                },
                alyPay: {
                    id: '',
                    app_id: '',//应用id
                    public_key: '',//公钥
                    private_key: '',//私钥
                },
                wechatPayRules: {
                    appid: [
                        { required: true, message: '请输入appid', trigger: 'blur' },
                    ],
                    mchid: [
                        { required: true, message: '请输入商户号', trigger: 'blur' },
                    ],
					secret: [
					    { required: true, message: '请输入app秘钥', trigger: 'blur' },
					],
                    key: [
                        { required: true, message: '请输入支付秘钥', trigger: 'blur' },
                    ],
                    SSLCERT_PATH: [
                        { required: true, message: '请输入SSL证书路径', trigger: 'blur' },
                    ],
                    SSLKEY_PATH: [
                        { required: true, message: '请输入SSL KEY路径', trigger: 'blur' },
                    ],

                },
                alyPayRules: {
                    app_id: [
                        { required: true, message: '请输入应用ID', trigger: 'blur' },
                    ],
                    public_key: [
                        { required: true, message: '请输入公钥', trigger: 'blur' },
                    ],
                    private_key: [
                        { required: true, message: '请输入私钥', trigger: 'blur' },
                    ],
                },
            };
        },
        mounted() {
            this.getConfigWechat();
            this.getConfigAlipay();
        },
        methods: {
             // 获取数据
             getConfigWechat() {
                getConfigWechat().then(res => {
                    if (res.state) {
                        console.log(res)
                        this.wechatPay = res.data || {}
                    }else{
                        this.$message(res.msg)
                    }
                })
            },
             // 获取数据
             getConfigAlipay() {
                getConfigAlipay().then(res => {
                    if (res.state) {
                        console.log(res)
                        this.alyPay = res.data || {}
                    }else{
                        this.$message(res.msg)
                    }
                })
            },
            saveWechat() {
                console.log('--------',this.wechatPay)
                saveWechat(this.wechatPay).then(res => {
                    if (res.state) {
                        this.$message.success(res.msg)
                    }else{
                        this.$message(res.msg)
                    }
                })
            },
            saveAlipay() {
                saveAlipay(this.alyPay).then(res => {
                    if (res.state) {
                        this.$message.success(res.msg)
                    }else{
                        this.$message(res.msg)
                    }
                })
            },
            submitForm(formName,type) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        // alert('submit!');
                        if(type==1){
                            this.saveWechat();
                        }
                        if(type==2){
                            this.saveAlipay();
                        }
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
           
        },
    };
</script>

<style lang="scss" scoped>
</style>